<mat-card class="card">
  <mat-card-header>
    <h3 mat-card-title>
      {{ 'Password' | translate }}
    </h3>
  </mat-card-header>

  <mat-card-content>
    <p class="row">
      <span class="label">{{ 'Change Required' | translate }}:</span>
      <span class="value">{{ user()?.password_change_required | yesNo }}</span>
    </p>

    <p class="row">
      <span class="label">{{ 'Age' | translate }}:</span>
      <span class="value">{{ !user().password_age && user().password_age !== 0
        ? '–'
        : '{n, plural, =0 {Less than a day} one {# day} other {# days} }' | translate: {
          n: user().password_age,
        }
        }}</span>
    </p>

    <p class="row">
      <span class="label">{{ 'History' | translate }}:</span>
      <span class="value">{{ '{n, plural, =0 {No History} one {# entry} other {# entries}}' | translate :
        { n: user().password_history?.length }
      }}</span>
    </p>

    <p class="row">
      <span class="label">{{ 'Last Change' | translate }}:</span>
      <span class="value">
        @if (user()?.last_password_change?.$date; as date) {
          {{ date | formatDateTime }}
        } @else {
          {{ 'Never' | translate }}
        }
      </span>
    </p>
  </mat-card-content>
</mat-card>

